// 懒加载
import { ref } from 'vue'
import { useIntersectionObserver } from '@vueuse/core'
// 懒加载
export const useLazyData = (apiFn) => {
  const target = ref(null)
  const goods = ref([])

  const { stop } = useIntersectionObserver(
    target,
    ([{ isIntersecting }], observerElement) => {
      // console.log(isIntersecting)
      // 当元素处于可视界面时，开始请求接口获取数据
      if (isIntersecting) {
        apiFn().then(({ result }) => {
          // console.log(result)
          goods.value = result
        })
        //   停止检测
        stop()
      }
    }
  )

  return { goods, target }
}
